var bigBox = document.getElementById("bigBox");//获取bigBox对象
var lis = document.querySelectorAll(".contain li");//获取li列表
var viewHeight = document.body.clientHeight;//获取可视区高度
var flag = true;//标记变量
var index = 0;//索引

function judge(obj, eventType, fun) {
    if (obj.addEventListener) {
        obj.addEventListener(eventType, fun);
    } else {
        obj.attachEvent("on" + eventType, fun);
    }
}

function solve(event) {
    var e = event || window.event;
    if (flag) {
        flag = false;
        if (e.wheelDelta > 0 || e.detail < 0) {//向上滚
            index--;
            if (index < 0) {
                index = 0;
            }
        }
        else {//向下滚
            index++;
            if (index > lis.length - 1) {
                index = lis.length - 1;
            }
        }
        bigBox.style.top = -index * viewHeight + "px";
        for (var i = 0; i < lis.length; i++) {
            lis[i].className = "";
        }
        lis[index].className = "active";
        setTimeout(() => {
            flag = true;
        }, 100)
    }
}

judge(document, "mousewheel", solve);//滚轮滚动事件
judge(document, "DOMMouseScroll", solve);//滚轮滚动事件，适配火狐浏览器

for (var i = 0; i < lis.length; i++) {
    lis[i].tag = i;
    lis[i].onclick = function () {
        for (var j = 0; j < lis.length; j++) {
            lis[j].className = "";
        }
        lis[this.tag].className = "active";
        index = this.tag;
        bigBox.style.top = -this.tag * viewHeight + "px";
    }
}
var divs = document.querySelectorAll(".big-box .item");
console.log(divs.length);
for (var i = 0; i < divs.length; i++) {
    divs[i].style.background = "url('" + "./images/bg" + (i + 1) + ".jpg" + "')";
    divs[i].style.backgroundSize = "cover";
}
var arr = ["传智动态", "标识示意"];
for (var i = 0; i < arr.length; i++) {
    var a = document.createElement("a");
    a.innerHTML = arr[i];
    a.className = "nof";
    a.href = "#";
    a.style.display = "block";
    document.getElementById("jianjie").appendChild(a);
}

var arr2 = ["使命", "愿景", "服务理念", "价值观"];
for (var i = 0; i < arr2.length; i++) {
    var a = document.createElement("a");
    a.innerHTML = arr2[i];
    a.className = "nof";
    a.href = "#";
    a.style.display = "block";
    document.getElementById("lilian").appendChild(a);
}

var arr3 = ["开设学科", "开设分校", "培养的学院", "出版的书籍", "分享的视频课件"];
for (var i = 0; i < arr3.length; i++) {
    var a = document.createElement("a");
    a.innerHTML = arr3[i];
    a.style.display = "block";
    a.href = "#";
    a.className = "nof";
    document.getElementById("yewu").appendChild(a);
}

var arr4 = ["企业合作", "高校合作"];
for (var i = 0; i < arr4.length; i++) {
    var a = document.createElement("a");
    a.innerHTML = arr4[i];
    a.style.display = "block";
    a.className = "nof";
    a.href = "#";
    document.getElementById("hezuo").appendChild(a);
}
var lis2 = document.querySelectorAll(".hson li");
for (var i = 0; i < lis2.length; i++) {
    lis2[i].tag = i;
    lis2[i].onclick = function () {
        for (var j = 0; j < lis2.length; j++) {
            lis2[j].className = "";
        }
        lis2[this.tag].className = "activeli";
    }
}

var as = document.querySelectorAll(".main a");
var pos = [0, 1, 2, 3, 3, 4, 5, 6, 7, 7, 8, 9, 10, 11, 12, 12, 13, 15, 16];
for (var i = 0; i < as.length; i++) {
    as[i].tag = i;
    as[i].onclick = function () {
        for (var j = 0; j < lis.length; j++) {
            lis[j].className = "";
        }
        index = pos[this.tag];
        lis[pos[this.tag]].className = "active";
        bigBox.style.top = -pos[this.tag] * viewHeight + "px";
    }
}

document.getElementById("down").onclick = function () {
    index++;
    if (index > lis.length - 1) {
        index = 0;
    }
    bigBox.style.top = -index * viewHeight + "px";
    for (var j = 0; j < lis.length; j++) {
        lis[j].className = "";
    }
    lis[index].className = "active";
}